﻿<UserControl xmlns:toolkit="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Toolkit"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:vsm="clr-namespace:System.Windows;assembly=System.Windows"
             xmlns:converters="clr-namespace:MainGameModule.Views.Converters"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:ec="http://schemas.microsoft.com/expression/2010/controls"
             mc:Ignorable="d"
			 xmlns:System="clr-namespace:System;assembly=mscorlib"
                    xmlns:ei="http://schemas.microsoft.com/expression/2010/interactions"
                    xmlns:ee="http://schemas.microsoft.com/expression/2010/effects"
                    xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity"
             x:Class="MainGameModule.Views.BadgesView">

    <UserControl.Resources>
        <ResourceDictionary>

            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="/YourWorld.Common;component/Styles/CommonResourcesDictionary.xaml" />
            </ResourceDictionary.MergedDictionaries>

            <converters:BoolToImageSourceConverter x:Key="BoolToImageSourceConverter" />
            <converters:BoolToVisibilityConverter x:Key="BoolToVisibilityConverter" />

           

            <DataTemplate x:Key="EventsDataTemplate">
                <StackPanel Orientation="Horizontal">
                    <Grid>
                        <Image Width="50"
                               Margin="5"
                               Source="{Binding Image}" />
                        <StackPanel Orientation="Horizontal"
                                    HorizontalAlignment="Right"
                                    VerticalAlignment="Bottom"
                                    Visibility="{Binding IsLocked, Converter={StaticResource BoolToVisibilityConverter}}">
                            <Image Source="images/hmenu-lock.png" />
                        </StackPanel>
                    </Grid>
                </StackPanel>
            </DataTemplate>

            <Style x:Key="BadgeListBoxItemStyle"
                   TargetType="ListBoxItem">
                <Setter Property="Padding"
                        Value="3" />
                <Setter Property="HorizontalContentAlignment"
                        Value="Left" />
                <Setter Property="VerticalContentAlignment"
                        Value="Top" />
                <Setter Property="Background"
                        Value="Transparent" />
                <Setter Property="BorderThickness"
                        Value="0" />
                <Setter Property="TabNavigation"
                        Value="Local" />
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="ListBoxItem">
                            <Grid Background="{TemplateBinding Background}">
                                <VisualStateManager.VisualStateGroups>
                                    <VisualStateGroup x:Name="CommonStates">
                                        <VisualState x:Name="Normal" />
                                        <VisualState x:Name="MouseOver">
                                            <Storyboard>
                                                <DoubleAnimation Duration="0"
                                                                 To="0.9"
                                                                 Storyboard.TargetProperty="(UIElement.Opacity)"
                                                                 Storyboard.TargetName="contentPresenter" />
                                            </Storyboard>
                                        </VisualState>
                                        <VisualState x:Name="Disabled" />
                                    </VisualStateGroup>
                                    <VisualStateGroup x:Name="SelectionStates">
                                        <VisualState x:Name="Unselected" />
                                        <VisualState x:Name="Selected">
                                            <Storyboard>
                                                <DoubleAnimation Duration="0"
                                                                 To="1"
                                                                 Storyboard.TargetProperty="(UIElement.Opacity)"
                                                                 Storyboard.TargetName="contentPresenter" />
                                            </Storyboard>
                                        </VisualState>
                                    </VisualStateGroup>
                                    <VisualStateGroup x:Name="FocusStates">
                                        <VisualState x:Name="Focused" />
                                        <VisualState x:Name="Unfocused" />
                                    </VisualStateGroup>
                                </VisualStateManager.VisualStateGroups>
                                <Rectangle x:Name="fillColor"
                                           IsHitTestVisible="False"
                                           Opacity="0"
                                           RadiusY="1"
                                           RadiusX="1" />
                                <Rectangle x:Name="fillColor2"
                                           Fill="#FFBADDE9"
                                           IsHitTestVisible="False"
                                           Opacity="0"
                                           RadiusY="1"
                                           RadiusX="1" />
                                <ContentPresenter x:Name="contentPresenter"
                                                  ContentTemplate="{TemplateBinding ContentTemplate}"
                                                  Content="{TemplateBinding Content}"
                                                  HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                                  Margin="{TemplateBinding Padding}"
                                                  Opacity="0.7" />
                                <Rectangle x:Name="FocusVisualElement"
                                           RadiusY="1"
                                           RadiusX="1"
                                           Stroke="#FF6DBDD1"
                                           StrokeThickness="1"
                                           Visibility="Collapsed" />
                            </Grid>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>

        </ResourceDictionary>
    </UserControl.Resources>

    <Grid x:Name="LayoutRoot"
          Width="600"
          Height="423">

        <Path x:Name="BackgroundRectangle"
              Data="M187.2383,141.7393C187.2383,141.7393,176.3913,144.7943,172.5713,149.0723C164.2383,158.4063,166.5713,209.7393,165.2383,221.7393C163.9053,233.7393,163.9053,364.4073,165.2383,397.0733C166.5713,429.7393,165.2383,441.7393,167.9053,452.4053C170.5713,463.0733,178.5713,462.4053,187.2383,465.7393C195.9053,469.0733,317.9053,475.0733,335.2383,475.0733C352.5713,475.0733,497.2383,476.4073,523.9053,475.0733C550.5723,473.7393,617.2393,476.4053,630.5723,469.7393C643.9053,463.0733,651.2383,452.4053,651.2383,435.7393C651.2383,419.0733,652.5713,301.0723,651.2383,249.0723C649.9053,197.0723,651.8313,159.3863,645.9053,150.4063C641.9333,144.3863,629.2383,143.7393,617.9053,141.7393C606.5723,139.7393,419.9053,137.7393,381.2383,138.4063C342.5713,139.0723,187.2383,141.7393,187.2383,141.7393z"
              Stretch="Fill">
            <Path.Effect>
                <DropShadowEffect Opacity="0.5" />
            </Path.Effect>
            <Path.Fill>
                <RadialGradientBrush RadiusX="0.8">
                    <GradientStop Color="#FFD1E778" />
                    <GradientStop Color="#FF4A6305"
                                  Offset="1" />
                </RadialGradientBrush>
            </Path.Fill>
        </Path>

        <Border VerticalAlignment="Top"
                Height="400">
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="Auto" />
                    <RowDefinition Height="Auto" />
                    <RowDefinition Height="*" />
                </Grid.RowDefinitions>
                
                <Button x:Name="CloseButton" 
                        Style="{StaticResource CloseButtonStyle}"
                        Command="{Binding CloseBadgesCommand}"/>
                
				<Image HorizontalAlignment="Left" Margin="-55,-34,0,-41" Source="images/badge.png" Stretch="Fill" Width="141" Grid.RowSpan="2"/>

                <Grid Grid.Row="2">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="Auto" />
                        <ColumnDefinition Width="*" />
                    </Grid.ColumnDefinitions>

                    <ScrollViewer HorizontalAlignment="Left"
                                  Margin="5,23,5,5"
                                  Width="230"
                                  Style="{StaticResource ListBoxScrollViewerStyle}"
                                  ScrollViewer.VerticalScrollBarVisibility="Visible"
                                  ScrollViewer.HorizontalScrollBarVisibility="Disabled"
                                  BorderBrush="Transparent"
                                  BorderThickness="2">

                        <ListBox x:Name="BadgesListBox"
                                 Background="Transparent"                                 
                                 ScrollViewer.HorizontalScrollBarVisibility="Disabled"
                                 ScrollViewer.VerticalScrollBarVisibility="Hidden"
                                 ItemsSource="{Binding UserBadges}"
                                 SelectedItem="{Binding SelectedBadge, Mode=TwoWay}"
                                 ItemTemplate="{StaticResource EventsDataTemplate}"
                                 ItemContainerStyle="{StaticResource BadgeListBoxItemStyle}"
                                 BorderThickness="0"
                                 Width="210">
                            <ListBox.ItemsPanel>
                                <ItemsPanelTemplate>
                                    <toolkit:WrapPanel ScrollViewer.HorizontalScrollBarVisibility="Hidden" />
                                </ItemsPanelTemplate>
                            </ListBox.ItemsPanel>
                        </ListBox>

                    </ScrollViewer>

                    <Grid Grid.Column="1"
                          x:Name="BadgeDetails"
                          Margin="15">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto" />
                            <RowDefinition Height="Auto" />
                            <RowDefinition Height="*" />
                            <RowDefinition Height="Auto" />
                        </Grid.RowDefinitions>

                        <TextBlock Text="{Binding SelectedBadge.Title}"
                                   FontSize="21.333"
                                   Foreground="White"
                                   VerticalAlignment="Center"
                                   HorizontalAlignment="Center"
                                   FontFamily="Segoa UI"
								   TextWrapping="Wrap" />

                        <Image Grid.Row="1"
                               Margin="5"
                               Height="120"
                               Width="120"
                               Stretch="Uniform"
                               HorizontalAlignment="Center"
                               VerticalAlignment="Center"
                               Source="{Binding SelectedBadge.Image}" />

                        <TextBlock Grid.Row="2"
                                   Margin="5"
                                   TextWrapping="Wrap"
                                   Text="{Binding SelectedBadge.Description}"
                                   FontFamily="Segoe UI"
                                   FontSize="13.333"
                                   Foreground="White" />
                        <Grid Grid.Row="3" VerticalAlignment="Bottom" Height="44">
							<Grid.ColumnDefinitions>
								<ColumnDefinition Width="Auto"/>
								<ColumnDefinition Width="*"/>
								<ColumnDefinition Width="Auto"/>
							</Grid.ColumnDefinitions>
							
							<HyperlinkButton    Grid.Column="0"
							HorizontalAlignment="Left"
                                                x:Name="ShareInFacebookButton"
					                            Margin="3"
					                            BorderBrush="Transparent"
					                            BorderThickness="0"
					                            TargetName="_blank">
					            <HyperlinkButton.Template>
					                <ControlTemplate TargetType="HyperlinkButton">
					                    <ContentPresenter Content="{TemplateBinding Content}" />
					                </ControlTemplate>
					            </HyperlinkButton.Template>
					            <StackPanel Orientation="Horizontal">
					                <Image Source="images/facebook_icon.png"
					                       Height="28" Margin="5"/>
					                <TextBlock Text="Share" VerticalAlignment="Center" FontSize="14.667" FontWeight="Bold" FontFamily="Segoe UI"/>
					            </StackPanel>
					        </HyperlinkButton>
							
							<!--<HyperlinkButton    Grid.Column="2"
							HorizontalAlignment="Right"
                                                x:Name="BecomeFanInFacebookButton"
					                            Margin="3"
					                            BorderBrush="Transparent"
					                            BorderThickness="0"
					                            TargetName="_blank">
					            <HyperlinkButton.Template>
					                <ControlTemplate TargetType="HyperlinkButton">
					                    <ContentPresenter Content="{TemplateBinding Content}" />
					                </ControlTemplate>
					            </HyperlinkButton.Template>
					            	<Border VerticalAlignment="Center" Height="24" BorderThickness="2" BorderBrush="#FFA9BDE2" CornerRadius="6">
					            			<Border.Background>
					            				<LinearGradientBrush StartPoint="1,0" EndPoint="1,1">
										            <GradientStop Color="#FF7094D8" Offset="0.0" />
										            <GradientStop Color="#FF3F63B6" Offset="1.0" />
										            <GradientStop Color="#FF4C6EB1" Offset="0.284"/>
										            <GradientStop Color="#FF3C5DAA" Offset="0.332"/>
										        </LinearGradientBrush>      			
											</Border.Background>
					            		<TextBlock Text="Become our fan on Facebook"
					            			FontSize="12"
											VerticalAlignment="Center"
											Margin="5 0 5 0" Foreground="White" FontFamily="Segoe UI" />
					            	</Border>
					        </HyperlinkButton>-->
							
                        </Grid>
                    </Grid>
                </Grid>
                <TextBlock Text="Badges"
                           Grid.Row="0"
                           VerticalAlignment="Center"
                           HorizontalAlignment="Center"
                           Foreground="Yellow"
                           FontWeight="Bold"
                           FontSize="30"
                           FontFamily="Segoe UI" >
                	<TextBlock.Effect>
                		<BlurEffect/>
                	</TextBlock.Effect>
                </TextBlock>
				<TextBlock Text="Badges"
                           Grid.Row="0"
                           VerticalAlignment="Center"
                           HorizontalAlignment="Center"
                           Foreground="White"
                           FontSize="29"
                           FontFamily="Segoe UI" Margin="0,1,0,0" />
            </Grid>
        </Border>
    </Grid>
</UserControl>